<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>海贼王</title>
        <style>
            header{
                background-image:url("1.png") ;
                height: 1000px;
            }
            nav a{
                font-size: large;
               color: rgb(212, 43, 153);
            } 
            a{
               text-decoration: none;
        }
        .五皇 {
               position: relative;
               display: inline-block;
              }
            .五皇-content
             {
               display: none;
               position: absolute;
               background-color: #f9f9f9;
               min-width: 160px;
               box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
               z-index: 1;
             }
             .五皇:hover .五皇-content 
             {
               display: block;
             }
            .五皇-content a 
             {
               color: rgb(23, 221, 228);
               padding: 12px 16px;
             }
            li a{
                color:aqua;
            }
            
            ul{
                position:fixed;
                left: 1200px;right:0;top:40px;bottom:0;margin:auto;
              }
            h1{
                position:fixed;
                left: 1200px;right:0;top:0;bottom:0;margin:auto;
              }
              div.三兄弟{
                float: left;
                width: 75%;
              }
              .last{
                color:#5f0bef;
               text-align: center;
              }
        </style>
    </head>
    <body>
        <header>
          
            <nav>
                <div><a href="果实.html">果实</a></div>
                <div><a href="路飞亲属关系.html">路飞亲属关系</a></div>
                <div class="五皇">
                    <button class="五皇">五皇</button>
                      <div class="五皇-content">
                    <a href="#">路飞</a>
                    <a href="#">香克斯</a>
                    <a href="#">黑胡子</a>
                    <a href="#">大妈</a>
                    <a href="#">小丑</a>
                </div>
            </nav>
        </header>
        <main align="center">
            <h1>海贼王故事线</h1>

            <ul>
              <li><a href="#路飞成为海贼王">路飞成为海贼王</a></li>
              <li><a href="#索隆成为第一剑客">索隆成为第一剑客</a></li>
              <li><a href="#山治找到all blue">山治找到all blue</a></li>
              <li><a href="#罗宾发现并解读所有历史正文">罗宾发现并解读所有历史正文</a></li>
              <li><a href="#乔巴研发万能药">乔巴研发万能药</a></li>
              <li><a href="#弗兰奇造出梦想之船">弗兰奇造出梦想之船</a></li>
              <li><a href="#娜美画出世界地图">娜美画出世界地图</a></li>
              <li><a href="#...">...</a></li>
            </ul>
            <div class="三兄弟">
              <p><img src="4.jpg"></p>
              <p><img src="3.jpg"></p>
              <p><img src="2.png"></p>
            </div>
            <h2>路飞个人介绍</h2><br/>
            <p>蒙其·D·路飞 （モンキー?D?ルフィ,Monkey.D.Luffy)是日本人气漫画 《海贼王》中的主角。草帽海贼团船长,特征是头戴草帽,天性乐观、热情、善良,天真,单纯,善恶分明,容易被感动,顽强,坚定,喜欢探险,最爱吃肉,有时候脑子里会少一根筋,做出一些傻里傻气的事情,但在关键时刻是一个非常靠得住的人,并表现出超出常人的冷静和机智,属于那种遇强则强的类型。路飞是吃了橡胶果实的能力者,橡胶人,身体具有绝佳的弹性与延展性,可以抵挡绝大多数的物理攻击,对雷电攻击具有绝缘性。梦想是找到传说中的ONE PIECE,成为海贼王。 </p><br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            
            <h2>艾斯个人介绍</h2>
            <p>姓名:波特卡斯·D·艾斯性别:男,绰号：火拳艾斯,出生地：南海帕特里拉岛,黑桃海贼团船长、 白胡子海贼团第二队队长（黑桃海贼团被白胡子打败后并入白胡子海贼团）,能力：烧烧果实,悬赏金：不详,所属团体：白胡子海贼团,梦想：让白胡子成为海贼王,得到“ONE PIECE”,父亲:哥尔·D·罗杰爷爷:蒙其·D·卡普弟弟:蒙奇·D·路飞;萨博，,死因:574话中确认,艾斯因大将赤犬使用熔岩之拳伤及内脏外貌:黑发，戴上一顶橘色的帽子，在帽子上有奸笑和难过这两种表情图案，而且帽子的绳子绑着一个骷髅头的牌子。脸颊两边都有一些雀斑，脖子挂着一条红珠项链,左手臂刺上“ASCE”这四个英文字母,其中S是被打叉的,腰部左边携带一把枪,至于背部刺上卍字型的白胡子象征。(后因反映说像纳粹和宗教标志 所以被改成骨头）,个性:只要不小心打扰他人，或者是路飞闯下什么样的大祸，都会主动向他人道歉；另外自己用完餐具，都亲自以餐巾来擦拭干净。由此可见，他有着重到礼节的方面。比如说：路飞不小心破坏到餐厅的墙壁，打扰到他人的吃饭时间；以及闻到小丑巴基船上的香味，没有经过巴基的允许就进入船中。还有他不允许任何人伤害到路飞或诽谤白胡子，否则直接给对方攻击。还有他吃饭到一半时，都会不知不觉地睡觉。另外他只要到任何餐厅吃完饭，都不会先付钱再逃跑。</p>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <h2>萨博个人介绍</h2>
            <p>萨博出身贵族家庭,在离家出走前一直接受贵族培养,但其个性在显露之时并未被抹杀扭曲,反而看透贵族家庭的虚伪,选择了遵从自己的意志。向往自由,认为男人应该保护好自己。年仅20岁便当上革命军参谋总长即革命军第二把交椅,革命军在德雷斯罗萨的行动都会向萨博请示。</p>    
          </main>
          <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            <br/>
            
          <footer>
            <div class="last">
              <h2>愿逐梦之人皆达所愿</h2>
            </div>
          </footer>
    </body>
</html>